<template>
  <view class="new_task">
    <view class="top-btns">
      <view class="" @click="goBack()" 
        >
		返回</view>
      <view class="top-btn" @click="addMineTask()" 
        >补录任务
		
		</view
      >
    </view>
    <view class="main">
      <view class="main-item">
        <input type="text" placeholder="请输入任务关键词" v-model="material" />
        <view class="btn-currency" @click="search()" style="width: 120rpx"
          >查询</view
        >
      </view>
    </view>
    <view
      class="main"
      v-for="(
        {
          id,
		  auditStatus_dictText,
		      participationTime,
          address,
          material,
          sessionsNum,
          taskPic,
          witness,
          witnessPhone
        },
        index
      ) in taskList"
      :key="index"
      
    >
      <view class="main-content">
        <view>时间：</view>
        <view>{{ participationTime }}</view>
      </view>
	  <view class="task-status">
	  	<text>{{auditStatus_dictText}}</text>
	  </view>
	 
      <view class="main-content">
        <view>地点：</view>
        <view>{{ address }}</view>
      </view>
      <view class="main-content">
        <view>任务描述：</view>
        <view></view>
      </view>
      <!-- <view class="rich-content">
				<rich-text :nodes="material"></rich-text>
			</view> -->
      <view class="main-content" style="margin-top: -30rpx;">
        <text>{{ material }}</text>
      </view>
      <view class="main-content">
        <view>场次：</view>
        <view>{{ sessionsNum }}</view>
      </view>
	  <view class="main-content">
	    <view style="display: block">任务照片：</view>
	  </view>
	  <view class="main-content ff" style="margin-top: -30rpx;">
        <img v-for="(item,indexs) in taskPic" :key="indexs" :src="`https://shengrun.91xiaokong.com/chewei/${item}`" alt="" class="task-img">
	     </view>
      <view class="main-content">
        <view>证明人：</view>
        <view>{{ witness }}</view>
      </view>
      <view class="main-content">
        <view>证明人手机：</view>
        <view>{{ witnessPhone }}</view>
      </view>
      
    </view>

   
  </view>
</template>

<script>
var _this;
import tabbar from "@/components/tab-bar";
import {taskList} from '@/api/tab2';

export default {
  components: {
    tabbar,
  },
  data() {
    return {
      // baseUrl: 'http://ey6pxx.natappfree.cc/jeecg-boot/',
      baseUrl: "http://weixiaokong.91xiaokong.com/jeecg-boot/",
      taskList: [],
      material: "",
      openId: "ogiDYs4eDr9DA2pofZeYsFQygtt4",
      nickname: "",
      headimgurl: "",
	  mine:""
    };
  },
  onLoad() {
    _this = this;
    let openid = uni.getStorageSync('openid')
    if (!openid) {
    	window.location.href = _this.baseUrl + 'wx/mp/wxLoginShare?';
    }
	else{
    	_this.openId = openid
    }
    _this.getopenId();
  },
  onShow() {
    _this.search();
  },
  methods: {
	  // 页面跳转
	  goBack(){
		uni.navigateBack({
			delta:1
		})  
	  },
	  addMineTask(){
		uni.navigateTo({
			url:"./add_minetask"
		})  
	  },
  
	// 搜索
	async search(my=false) {
		const {openId,mine,rescueType,material} = _this;
		let params = {
			openId,material,mine:"1",rescueType:"4"
		}
		if(my) params = {
			...params, mine: openId
		}
		const {result:{records}} = await taskList(params);
    let result = []
    records.forEach(_=>{
      result.push({
        ..._,
        taskPic: _.taskPic ? _.taskPic.split(','): []
      })
    })
		_this.taskList = result;
	},
    goRelease() {
      uni.navigateTo({ url: "../release_task/release_task" });
    },

    // 任务详情
    goDetail(id) {
      uni.navigateTo({
        url: `../task_detail/task_detail?id=${id}`,
      });
    },
	
    // 获取openid
    getopenId() {
      let url = window.location.href;
      _this.url = url;
      let url_1 = url.split("?"); // TODO: 鬼知道你在干嘛....像是梦游
      if (url_1.length > 1) {
        let url_2 = url_1[1].split("&");
        url_2.forEach(function (e) {
          if (e.indexOf("openid") > -1) {
            _this.openId = e.split("=")[1];
            uni.setStorage({
              key: "openid",
              data: _this.openId,
              success: function () {
                console.log("success");
              },
            });
          }
          if (e.indexOf("nickname") > -1) {
            _this.nickname = e.split("=")[1];
            uni.setStorage({
              key: "nickname",
              data: _this.nickname,
              success: function () {
                console.log("success");
              },
            });
          }
          if (e.indexOf("headimgurl") > -1) {
            _this.headimgurl = e.split("=")[1];
            uni.setStorage({
              key: "headimgurl",
              data: _this.headimgurl,
              success: function () {
                console.log("success");
              },
            });
          }
        });
      }
    },
  },
};
</script>

<style>
	.task-status{
		position: absolute;
		right: 100rpx;
		color: #666666;
	}
	.task-img{
		width: 19%;
    margin-right: 3px;
	}
.top-btns{
	width: 90%;
	margin: -40rpx auto 40rpx;
	display: flex;
	justify-content: space-between;
}
.top-btn{
	color: #fff;
	display: flex;
	border: 1rpx;
	width: 140rpx;
	height: 50rpx;
	line-height: 50rpx;
	border-radius: 30rpx;
	background-color: #B30002;
	justify-content: center;
}

.new_task {
  padding-bottom: 140rpx;
  padding-top: 80rpx;
}

.main-item {
  display: flex;
  justify-content: space-around;
  line-height: 100rpx;
  flex-wrap: wrap;
  margin-bottom: 30rpx;
}

.main-item input {
  width: 70%;
  height: 60rpx;
  line-height: 60rpx;
  border: 2rpx solid #cccccc;
  border-radius: 30rpx;
  padding: 0 20rpx;
  margin: auto;
}

.main-item view {
  width: 150rpx;
  height: 60rpx;
  line-height: 40rpx;
  margin-top: 40rpx;
  margin-left: 50rpx;
  border-radius: 30rpx;
  font-size: 30rpx;
  padding: 10rpx;
  text-align: center;
  margin: auto;
}

.btn-currency {
  background-color: #b30002;
  color: #ffffff;
  border: none;
}

.main {
  width: 88%;
  margin: 0 auto;
  box-shadow: 0px 0px 30px 0px rgb(0 0 0 / 10%);
  border-radius: 20rpx;
  padding: 30rpx;
  margin-bottom: 30rpx;
  background-color: #fff;
  border: 2rpx #706d6c;
}

.main-content {
  display: flex;
  padding: 20rpx 0;
}

.gray {
  color: #999999;
}

.main-content view:first-of-type {
  white-space: nowrap;
}

.ff{
  
}

</style>
